<template>
  <div class="userinfo">
    <el-row class="userinfo-head">
      <el-col :span="6"><el-avatar size="40" shape="square" src="https://img.aliyundrive.com/avatar/ec56efec2b0348ed862e9c4f0dde35b7.jpeg"></el-avatar></el-col>
      <el-col :span="14">
        {{$store.state.username}}
      </el-col>
      <el-col :span="4" style="display: flex;flex-direction: row-reverse">
        <el-button type="text" size="mini" @click="quitLogin()">退出</el-button>
      </el-col>
    </el-row>
    <el-row class="userinfo-main">
      <el-col :span="24"><span>93.51 GB / 1.47 TB</span></el-col>
    </el-row>
    <div class="userinfo-foot">
      <el-progress :text-inside="true" :stroke-width="12" :percentage="70"></el-progress>
    </div>
  </div>
</template>

<script>
export default {
  name: "Sinfo",
  methods:{
    quitLogin(){
      this.$store.commit("setToken",'');
      this.$store.commit("setUserName",'');
      this.$router.replace('/login/')
    }
  }
}
</script>

<style scoped>

</style>
